<template>
  <div class="about">
    <h1>列表页</h1>
    <a-button @click="deletes" type="danger">删除</a-button>
    <a-button @click="getData" type="primary">重置</a-button>
    <Table :columns="columns" :listData="listData"></Table>
  </div>
</template>
<script>
const columns = [
  { title: "文章名称", key: "class", dataIndex: "class", align: "center" },
  { title: "作者", key: "cid", dataIndex: "cid", align: "center" },
  { title: "访问量", key: "visits", dataIndex: "visits", align: "center" },
];
import { article } from "api/article.js";
import Table from "@/components/table/index.vue";
export default {
  data() {
    return {
      listData: [],
      columns,
    };
  },
  components: {
    Table,
  },
  created() {
    this.getData();
  },
  methods: {
    async getData() {
      const data = await article();
      this.listData = data;
    },
    deletes() {
      this.listData.splice(0, 10);
    },
  },
};
</script>
